<template>
  <div>
    <!-- <div class="toptitle">大区价格编码</div> -->
    <el-form
      :inline="true"
      :model="formInline"
      class="demo-form-inline"
      @keyup.enter.native="search()"
    >
      <el-form-item label="商品名称">
        <el-input v-model="formInline.user" placeholder clearable></el-input>
      </el-form-item>
      <el-form-item label="商品分类：">
        <el-select v-model="formInline.goodsTypeId" clearable>
          <el-option
            v-for="(send, i) in typeData"
            :key="i"
            :value="send.goodsTypeId"
            :label="send.goodsTypeName"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          @click="search()"
          size="mini"
          icon="el-icon-search"
          >查询</el-button
        >
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          @click="kong()"
          size="mini"
          icon="el-icon-delete"
          >清空</el-button
        >
      </el-form-item>
    </el-form>
    <el-table
      :data="tableData"
      style="width: 100%; margin-bottom: 20px;"
      border
      v-loading="loading"
    >
      <el-table-column
        type="index"
        label="序号"
        align="center"
        width="60"
      ></el-table-column>
      <el-table-column prop="orgSeqName" label="大区"></el-table-column>
      <el-table-column
        prop="goodsTypeName"
        label="分类名称"
        show-overflow-tooltip
      ></el-table-column>
      <el-table-column
        prop="goodsName"
        label="商品名称"
        show-overflow-tooltip
      ></el-table-column>
      <el-table-column prop="unitName" label="单位名称"></el-table-column>
      <el-table-column prop="memberPrice" label="会员价"></el-table-column>
      <el-table-column prop="salePrice" label="建议零售价"></el-table-column>
      <el-table-column
        prop="saleLowerPrice"
        label="总部底价（元）"
        align="right"
        :formatter="fixData"
      ></el-table-column>
      <el-table-column
        prop="warzooeLowerPrice"
        label="大区底价（元）"
        align="center"
      >
        <template slot-scope="scope">
          <el-input
            :maxlength="8"
            oninput="value=value.replace(/[^0-9.]/g,'')"
            v-model="scope.row.warzooeLowerPrice"
            style="width: 120px; text-align-last: right;"
            @change="
              (data) => {
                (scope.row.warzooeLowerPrice = toPrice2(data)),
                  changeEditData(scope.row);
              }
            "
          ></el-input>
        </template>
      </el-table-column>
      <!-- <el-table-column prop="salePrice" label="总部标准价（元）" align="center">
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.salePrice"
              style="width:80px;text-align:right"
              @input="getChangeData(scope.row.salePrice)"
            ></el-input>
          </template>
      </el-table-column>-->
      <!-- <el-table-column label="操作" width="200" align="center">
        <template slot-scope="scope" fixed="right">
          <el-button
            size="mini"
            @click="edit(scope.row)"
            type="text"
            v-if="scope.row.priceId != null"
      >编辑</el-button>-->
      <!-- <el-button
            size="mini"
            @click="add(scope.row)"
            type="text"
            v-if="scope.row.priceId == null"
          >保存</el-button>
          <el-button @click="handledelete(scope.row)" type="text" size="mini">删除</el-button>
        </template>
      </el-table-column>-->
    </el-table>
    <el-form :inline="true" :model="formInline">
      <el-form-item style="margin-top: 6px;"></el-form-item>
    </el-form>
    <div class="block" style="margin-top: -49px;">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 20, 30, 50, 100]"
        :current-page="listQuery.current"
        :page-size="listQuery.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import {
  queryGoodsPriceList,
  addGoodsPrice,
  updateGoodsPrice,
  deletGoodsPrice,
  updaterole,
  getUserOrgType,
} from '@/api/warPricemanage';
import { queryGoodsCategorys } from '@/api/warProductmanage';
import qs from 'qs';
export default {
  data() {
    return {
      tableData: [],
      loading: true,
      dialogVisibleorg: false,
      dialogVisibleorgone: false,
      typeData: [],
      ruleForm: {
        goodsId: '',
        goodsTypeName: '',
        status: '',
        isDisplay: '',
        displayForm: '',
        goodsTypeId: '',
        upGoodsType: '',
      },
      orgSeqxia: '',
      ruleFormorg: {
        goodsTypeId: '',
        goodsTypeName: '',
        status: '',
        isDisplay: '',
        displayForm: '',
        goodsTypeId: '',
        upGoodsType: '',
      },
      total: 0,
      options: [],
      optionsone: [],
      listQuery: {
        current: 1,
        size: 10,
      },
      flagorg: false,
      dialogVisible: false,
      formInline: {
        user: '',
        region: '',
        goodsId: '',
        goodsTypeId: '',
      },
      rules: {},
    };
  },
  mounted() {
    this.formInline.goodsId = this.$route.query.goodsId
      ? this.$route.query.goodsId
      : '';
    this.getDataList();
    this.getProductType();
  },
  activated() {},
  methods: {
    //获取商品分类列表
    getProductType(v) {
      let data = {};
      queryGoodsCategorys(data).then((res) => {
        this.typeData = res.records;
      });
    },
    // creatoneOrg() {
    //   this.dialogVisibleorg = !this.dialogVisibleorg;
    // },
    // creatoneOrgone(v) {
    //   console.log(v, "ll");
    //   this.flagorg = true;
    //   this.orgSeqxia = v.goodsTypeId;
    //   this.dialogVisibleorgone = !this.dialogVisibleorgone;
    // },
    // confirmEditone() {
    //   let data = {
    //     goodsTypeName: this.ruleForm.goodsTypeName,
    //     status: this.ruleForm.status,
    //     isDisplay: this.ruleForm.isDisplay,
    //     displayForm: this.ruleForm.displayForm,
    //     goodsTypeId: this.ruleForm.goodsTypeId,
    //     upGoodsType: this.ruleForm.upGoodsType
    //   };
    //   addGoodsPrice(data).then(res => {
    //     this.$message({
    //       showClose: true,
    //       message: "添加成功",
    //       type: "success"
    //     });
    //     this.dialogVisibleorg = !this.dialogVisibleorg;
    //     this.getDataList();
    //   });
    // },
    // confirmEdittwo() {
    //   if (this.flagorg == false) {
    //     let dataone = {
    //       goodsTypeName: this.ruleFormorg.goodsTypeName,
    //       status: this.ruleFormorg.status,
    //       isDisplay: this.ruleFormorg.isDisplay,
    //       displayForm: this.ruleFormorg.displayForm,
    //       goodsTypeId: this.ruleFormorg.goodsTypeId
    //     };
    //     addGoodsPrice(dataone).then(res => {
    //       this.dialogVisibleorgone = !this.dialogVisibleorgone;
    //       this.$message({
    //         showClose: true,
    //         message: "修改成功",
    //         type: "success"
    //       });
    //       this.getDataList();
    //     });
    //   } else if (this.flagorg == true) {
    //     let data = {
    //       goodsTypeName: this.ruleFormorg.goodsTypeName,
    //       status: this.ruleFormorg.status,
    //       isDisplay: this.ruleFormorg.isDisplay,
    //       displayForm: this.ruleFormorg.displayForm,
    //       goodsTypeId: this.ruleFormorg.goodsTypeId,
    //       upGoodsType: this.orgSeqxia
    //     };
    //     addGoodsPrice(data).then(res => {
    //       this.$message({
    //         showClose: true,
    //         message: "添加成功",
    //         type: "success"
    //       });
    //       this.dialogVisibleorgone = !this.dialogVisibleorgone;
    //       this.getDataList();
    //     });
    //   }
    // },
    // changeorg(v) {
    //   this.dialogVisibleorgone = !this.dialogVisibleorgone;
    //   var userId = localStorage.getItem("userId");
    //   this.ruleFormorg.goodsTypeName = v.goodsTypeName;
    //   this.ruleFormorg.goodsTypeId = v.goodsTypeId;
    //   (this.ruleFormorg.status = v.status),
    //     (this.ruleFormorg.isDisplay = v.isDisplay),
    //     (this.ruleFormorg.displayForm = v.displayForm),
    //     (this.ruleFormorg.upGoodsType = v.upGoodsType),
    //     (this.flagorg = false);
    // },
    kong() {
      this.formInline.user = '';
      this.formInline.region = '';
      this.formInline.goodsId = '';
      this.formInline.goodsTypeId = '';
    },
    toPrice(val, type) {
      // 值，符号
      if (val === null || val === undefined || val === '') {
        return '0.00';
      } else {
        var data = Number(val)
          .toFixed(2)
          .split('.');
        var data2 = data[0]
          .split('')
          .reverse()
          .join('');
        var newData = data2;
        if (type) {
          return (
            type +
            newData
              .split('')
              .reverse()
              .join('')
              .slice(1) +
            '.' +
            data[1]
          );
        } else {
          return (
            newData
              .split('')
              .reverse()
              .join('')
              .slice(0) +
            '.' +
            data[1]
          );
        }
      }
    },
    toPrice2(val, type) {
      // 值，符号
      if (val === null || val === undefined || val === '') {
        return '0.00';
      } else {
        var data = Number(val)
          .toFixed(2)
          .split('.');
        var data2 = data[0]
          .split('')
          .reverse()
          .join('');
        var newData = data2;
        if (type) {
          return (
            type +
            newData
              .split('')
              .reverse()
              .join('')
              .slice(1) +
            '.' +
            data[1]
          );
        } else {
          return (
            newData
              .split('')
              .reverse()
              .join('')
              .slice(0) +
            '.' +
            data[1]
          );
        }
      }
    },
    search() {
      this.loading = true;
      this.logininfo = localStorage.getItem('logininfo');
      this.orgSeq = JSON.parse(this.logininfo).orgSeq;
      let data = {
        size: this.listQuery.size,
        current: 1,
        condition: {
          goodsName: this.formInline.user,
          goodsTypeId: this.formInline.goodsTypeId,
          orgSeq: this.orgSeq,
          goodsId: this.formInline.goodsId,
        },
      };
      queryGoodsPriceList(data).then((res) => {
        this.loading = false;
        this.total = res.total;
        this.tableData = res.records;
      });
    },

    // indexMethod(index) {
    //   let curpage = this.listQuery.current; //单前页码，具体看组件取值
    //   let limitpage = this.listQuery.size; //每页条数，具体是组件取值
    //   return index + 1 + (curpage - 1) * limitpage;
    // },
    // handledelete(v) {
    //   console.log(v, "pp");
    //   let data = {
    //     warzonePriceId: v.warzonePriceId
    //   };
    //   this.$confirm("确认删除吗？").then(_ => {
    //     deletGoodsPrice(qs.stringify(data)).then(res => {
    //       this.$message({
    //         showClose: true,
    //         message: "删除成功",
    //         type: "success"
    //       });
    //       this.getDataList();
    //     });
    //   });
    //   console.log(v, "pppp");
    // },
    // add() {
    //   let data = {
    //     goodsId: v.goodsId,
    //     warzooeLowerPrice: v.warzooeLowerPrice
    //   };
    //   updateGoodsPrice(data).then(res => {
    //     this.$message({
    //       showClose: true,
    //       message: "添加成功",
    //       type: "success"
    //     });
    //     this.getDataList();
    //   });
    // },
    //页面自动保存
    changeEditData(v) {
      if (v.warzooeLowerPrice < v.saleLowerPrice) {
        this.$message({
          showClose: true,
          message: '大区底价不能低于总部底价',
          type: 'info',
        });
        this.getDataList();
        return false;
      }
      let data = {
        warzonePriceId: v.warzonePriceId,
        goodsId: v.goodsId,
        warzoneGoodsId: v.warzoneGoodsId,
        warzooeLowerPrice: v.warzooeLowerPrice,
      };
      updateGoodsPrice(data).then((res) => {
        this.$message({
          showClose: true,
          message: '修改成功',
          type: 'success',
        });
        this.getDataList();
      });
    },
    // confirmEdit(v) {
    //   console.log(v, "ff");
    //   if (this.ruleForm.goodsName == "" || this.ruleForm.goodsName == null) {
    //     this.$message.error("请输入本级价格名称");
    //     return;
    //   }
    //   if (
    //     this.ruleForm.goodsTypeId == "" ||
    //     this.ruleForm.goodsTypeId == null
    //   ) {
    //     this.$message.error("请输入本级价格编码");
    //     return;
    //   }
    //   if (this.ruleForm.upOrgSeq == "" || this.ruleForm.upOrgSeq == null) {
    //     this.$message.error("请选择上级价格名称");
    //     return;
    //   }
    //   if (this.ruleForm.orgType == "" || this.ruleForm.orgType == null) {
    //     this.$message.error("请选择价格类型");
    //     return;
    //   }
    //   if (this.editflag) {
    //     //   var u1 = "u1";
    //     var userId = localStorage.getItem("userId");
    //     let data = {
    //       goodsName: this.ruleForm.goodsName,
    //       goodsTypeId: this.ruleForm.goodsTypeId,
    //       upOrgSeq: this.ruleForm.upOrgSeq,
    //       upOrgSeqName: this.ruleForm.upOrgSeqName,
    //       orgType: this.ruleForm.orgType,
    //       updateUser: this.ruleForm.updateUser,
    //       status: "1"
    //     };
    //     addGoodsPrice(data).then(res => {
    //       this.dialogVisible = !this.dialogVisible;
    //       this.$message({
    //         showClose: true,
    //         message: "添加成功",
    //         type: "success"
    //       });
    //       this.getDataList();
    //     });
    //   } else {
    //     //var u1 = "u1";
    //     var userId = localStorage.getItem("userId");
    //     let data = {
    //       priceId: this.ruleForm.priceId,
    //       goodsId: this.ruleForm.goodsId,
    //       saleLowerPrice: this.ruleForm.saleLowerPrice,
    //       salePrice: this.ruleForm.salePrice,
    //       movePrice: this.ruleForm.movePrice
    //     };
    //     updateGoodsPrice(data).then(res => {
    //       // this.dialogVisible = !this.dialogVisible;
    //       this.$message({
    //         showClose: true,
    //         message: "修改成功",
    //         type: "success"
    //       });
    //       this.getDataList();
    //     });
    //   }
    // },
    handleSizeChange(val) {
      this.listQuery.size = val;
      this.getDataList();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.getDataList();
    },
    // handleClick(v) {
    //   if (v.status === 0) {
    //     var uuid = 1;
    //   } else if (v.status === 1) {
    //     var uuid = 0;
    //   }
    //   let data = { roleId: v.roleId, status: uuid };
    //   usebutton(data).then(res => {
    //     this.$message({
    //       showClose: true,
    //       message: res.message,
    //       type: "success"
    //     });
    //     this.getDataList();
    //   });
    // },
    getDataList() {
      this.logininfo = localStorage.getItem('logininfo');
      this.orgSeq = JSON.parse(this.logininfo).orgSeq;
      let data = {
        size: this.listQuery.size,
        current: this.listQuery.current,
        condition: {
          goodsName: this.formInline.user,
          goodsId: this.formInline.goodsId,
          goodsTypeId: this.formInline.goodsTypeId,
          // type: this.formInline.region,
          orgSeq: this.orgSeq,
        },
      };
      queryGoodsPriceList(data).then((res) => {
        res.records.forEach((item, i) => {
          item.warzooeLowerPrice = this.toPrice(item.warzooeLowerPrice);
          this.options.push({
            value: item.goodsTypeId,
            label: item.goodsTypeName,
          });
        });

        this.loading = false;
        this.total = res.total;
        this.tableData = res.records;
        this.formInline.goodsId = '';
      });

      // let dataone = {
      //   orgType: "",
      //   orgTypeName: ""
      // };

      // getUserOrgType(dataone).then(res => {
      //   res.records.forEach((item, i) => {
      //     this.optionsone.push({
      //       value: item.orgType,
      //       label: item.orgTypeName
      //     });
      //   });
      // });
    },
    fixData(row, column, cellValue, index) {
      if (cellValue != null && !isNaN(cellValue)) {
        return cellValue.toFixed(2);
      } else {
        return cellValue;
      }
    },
  },
};
</script>
<style lang="less" scoped>
.toptitle {
  border: 1px solid #e0e0e0;
  border-bottom: 2px solid #188097;
  background: #f5f5f5;
  line-height: 35px;
  margin-bottom: 10px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: bold;
}
</style>
